.comment-item {
    display: grid;

    grid-template-columns: minmax(0, 2vw) 2fr 1fr minmax(0, 2vw);
    grid-template-rows: max-content max-content min-content;

    grid-gap: 0.5em;
    /*padding: 0.333rem;*/
}

.comment-item > .comment-id {
    grid-row: 1 / 2;
    grid-column:  2 / 3;
}
.comment-item > .comment-content {
    grid-row: 2 / 3;
    grid-column:  2 / 4;
}

.comment-item > .comment-separator {
    grid-row: 3 / 4;
    grid-column: 1 / 5;
}

.comment-item > .comment-publishDate {
    grid-row: 1 / 2;
    grid-column: 3 / 4;

    text-align: right;
}


.comment-item > * {
    margin-top: 0;
    margin-bottom: 0;

    padding-top: 0;
    padding-bottom: 0;
}

.comment-list {

    margin-bottom: 20vh;

}

.comment-list > * {
    margin-top: 0;
    margin-bottom: 1rem;
}


@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .comment-item > .comment-publishDate {
        display: none;
    }
}